#bideli{
  // 头图
  .topBg{
    position: relative;
    display: flex;
    width: 100%;
    height: 0;
    padding-bottom: 35%;
    overflow: hidden;
    background: url(../../../static/static/addImg/saveMoneyLive/bideliBigImg.png) no-repeat center center/100% 100%;
    .pageInfo{
      margin: 10% auto 0;
      color: $white-color;
      text-align: center;
      img{
        width: 424px;
        height: 138px;
      }
      .pageTitleDes{
        margin-top: 31px;
        line-height:45px;
        font-size: 30px;
        .beforeAndAfter{
          position: relative;
          margin: 0 30px;
          &::before{
            position: absolute;
            content: '';
            left: -17px;
            top: 15px;
            width: 5px;
            height: 5px;
            background: $sub-background-color;
            border-radius: 50%;
          }
          &::after{
            position: absolute;
            content: '';
            right: -17px;
            top: 15px;
            width: 5px;
            height: 5px;
            background: $sub-background-color;
            border-radius: 50%;
          }
        }
      }
    }
  }
  // 个人购买记录按钮
  .personRecord{
    position: fixed;
    z-index: 99;
    right: 50px;
    top: 200px;
    width: 70px;
    height: 140px;
    box-shadow: $box-shadow-style1;
    .my_investment, .income_detail{
      height: 70px;
      text-align: center;
      div{
        height: 50%;
      }
      .iconDiv{
        padding-top: 14px;
        i{
          color: $btn-lightBlue-color;
        }
      }
      .text{
        line-height: 35px;
      }
    }
    .my_investment{
      background: $buy-btn-bgColor;
      color: $white-color;
      .iconDiv{
        i{
          color: $white-color;
        }
      }
    }
  }
  // 走马灯
  .bideliRecord_Banner{
    height: 90px;
    .bideliRecord_Banner_middle{
      margin: 0 auto;
      width: 1200px;
      height: 40px;
      background: $list-hover-background;
      .bideliCont_Banner_icon,
      .bideliCont_Banner_info{
        float: left;
      }
      .bideliCont_Banner_icon{
        width: 55px;
        textAlignCnter()
        i{
          color: #FBBB39;
          line-height: 40px;
        }
      }
      .bideliCont_Banner_info{
        position: relative;
        height: 40px;
        width: 1120px;
        overflow: hidden;
        ul{
          position: absolute;
          left: 0;
          top: 0;
          width: auto;
          height: 40px;
          li{
            float: left;
            width: 350px;
            line-height: 40px;
          }
        }
      }
    }
  }
  // 内容区
  .product_cont{
    position: relative;
    margin:0 auto;
    width: 1200px;
    padding-top: 50px;
    overflow: hidden;
    // 热门产品
    .hot{
      margin-bottom: 30px;
      line-height:40px;
      .hot_title{
        font-size:28px;
      }
    }
    .product{
      width: 1250px;
      padding-bottom: 30px;
      .product_item{
        float: left;
        margin: 0 15px 20px 0;
        width: 390px;
        height: 320px;
        transition: .3s;
        text-align: center;
        box-shadow: $box-shadow-style1;
        &:hover{
          transform: scale(1.1)
        }
        .logo{
          display: flex;
          margin-bottom: 10px;
          padding-top: 30px;
          height: 40px;
          vertical-align: middle;
          img{
            margin: auto;
            width: 40px;
            height: 40px;
          }
        }
        .name{
          line-height:28px;
        }
        .percentage{
          margin-top: 10px;
          line-height:67px;
          color: $pro-price-color;
          .num{
            font-size: 48px;
          }
        }
        .statement{
           color: $explain-font-color;
        }
        .btn{
          margin-top: 36px;
          &.sale_time{
            color: $btn-lightBlue-color;
          }
          button{
            width: 120px;
            height: 40px;
            border-radius: 0;
          }
        }
      }
    }
  }
  .management_cont{
    padding-top: 50px;
    .management_cont_Info{
      margin: 0 auto;
      width: 1200px;
      .title{
        font-size:28px;
        line-height:40px;
      }
      .table{
        margin-top: 20px;
        table{
          tbody{
            tr{
              line-height: 88px;
              height: 88px;
              border-bottom: 1px solid $border-blue-color;
            }
            tr{
              &:hover{
                background: $list-hover-background;
              }
              &:nth-child(1){
                line-height: 50px;
                height: 50px;
              }
              td{
                color: $font-color666;
              }
              .rate_return,
              .term,
              .name,
              .amount,
              .remaining{
                text-align: left;
              }
              .rate_return{
                width: 224px;
              }
              .term{
                width: 180px;
              }
              .rate_return, .term{
                .text{
                  position: relative;
                  .ascending, .deescending{
                    position: absolute;
                    right: -18px;
                    width: 5px;
                    height: 5px;
                    border-style: solid;
                    border-width: 1px;
                    border-color: transparent transparent $explain-font-color $explain-font-color;
                    &:hover{
                      border-color: transparent transparent $btn-lightBlue-color $btn-lightBlue-color;
                    }
                  }
                  .ascending{
                    top: 0;
                    transform: rotateZ(135deg);
                  }
                  .deescending{
                    top: 6px;
                    transform: rotateZ(-45deg);
                  }
                  .showActive{
                    border-color: transparent transparent $btn-lightBlue-color $btn-lightBlue-color;
                  }
                }
              }
              .name{
                width: 306px;
              }
              .amount{
                width: 176px;
              }
              .remaining{
                width: 172px;
              }
              .operating{
                width: 142px;
                textAlignCnter()
                button{
                  width: 100px;
                  height: 35px;
                  border-radius: 0;
                }
              }
              .textIndent{
                text-indent: 34px;
              }
              .rate_return_data{
                .rate_return_percentage{
                  color: $pro-price-color;
                  line-height:33px;
                  font-size:24px;
                  text-indent: 25px;
                  transform: translateY(-10px);
                }
                .rate_return_text{
                  color: $explain-font-color;
                  line-height:20px;
                  text-indent: 18px;
                  transform: translateY(-10px);
                }
              }
              .days{
                color: $base-font-color;
              }
              .sale_time, .buy_now{
                color: $btn-lightBlue-color;
              }
            }
          }
        }
      }
    }
  }
  .problem{
    padding-bottom: 50px;
    .middle_cont{
      margin: 0 auto;
      width: 1200px;
      .rule{
        p{
          margin-bottom: 10px;
          font-size: 14px;
          line-height: 24px;
          strong{
            height: 26px;
            line-height: 26px;
            font-size: 18px;
            font-weight: 400;
          }
        }
      }
    }
  }
  .areaTitle{
    font-size: 36px;
    color: $explain-font-color;
    text-align: center;
    height: 190px;
    line-height: 190px;
    .line{
      position: relative;
      display: inline-block;
      margin: 0 30px;
      transform: translateY(-7px);
      width: 50px;
      height: 3px;
      &.left{
        background: $problem-titler-line-bgColor-left;
        &::after{
          position: absolute;
          content: '';
          width: 10px;
          height: 10px;
          border-radius: 50%;
          background: $explain-font-color;
          right: -15px;
          top: -4px;
        }
      }
      &.right{
        background: $problem-titler-line-bgColor-right;
        &::before{
          position: absolute;
          content: '';
          width: 10px;
          height: 10px;
          border-radius: 50%;
          background: $explain-font-color;
          left: -15px;
          top: -4px;
        }
      }
    }
  }
  .dialog-pops .dialog-contents{
    line-height:33px;
    font-weight: 500;
  }
}
